<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>抽奖 - {$reply['title']}</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <link rel="stylesheet" href="../addons/haoman_dpm/img2/common.css?v=433223" type="text/css">
    <style>
    html,body{
        height: 100%;
    }
    .user-list li {
        opacity: 0.9
    }
    
    .detail-box {
        opacity: 0.9
    }
    {if empty($video['vodio_bg5'])}#wrap{ background:url({$bg}) center 0 no-repeat; background-size:cover;height: 100%;}{/if}
    
    {if !empty($reply['backcolor'])}
    .props-color{ background:-webkit-linear-gradient(top , {$reply['backcolor']} ,{$reply['backcolor']}); background:-moz-linear-gradient(top , {$reply['backcolor']} ,{$reply['backcolor']}); background:-o-linear-gradient(top , {$reply['backcolor']} ,{$reply['backcolor']}); box-shadow: inset -1px 1px rgba(204,204,204,.2)}
    .lott-w span,.rock-name,.join-num,.choose-num{ color:#ffffff;}
    .und-btn a,.btn-color,.btn-start{border:1px solid {$reply['backcolor']}; border-radius:4px; background:-moz-linear-gradient(top , {$reply['backcolor']}, {$reply['backcolor']}); background: -webkit-linear-gradient(top , {$reply['backcolor']}, {$reply['backcolor']}); background:-o-linear-gradient(top , {$reply['backcolor']}, {$reply['backcolor']});}
    .und-btn a:hover,.btn-color:hover,.btn-start:hover{ background:-moz-linear-gradient(top , {$reply['backcolor']}, {$reply['backcolor']}); background:-webkit-linear-gradient(top , {$reply['backcolor']}, {$reply['backcolor']});background:-o-linear-gradient(top , {$reply['backcolor']}, {$reply['backcolor']});}
    {/if}
    .themeBox{
    color: {if empty($xysreply['xys_backcolor'])}#fff604;{else}{$xysreply['xys_backcolor']};{/if};
    }
    </style>
    <!-- <script type="text/javascript" src="../addons/haoman_dpm/img2/jquery-1.9.1.min.js"></script> -->
    <script type="text/javascript" src="../addons/haoman_base/base/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../addons/haoman_base/base/jquery.cookie.js"></script>
    <script type="text/javascript">


        (function($) {
           

          var cache = [];
          $.preLoadImages = function() {
            var args_len = arguments.length;
            for (var i = args_len; i--;) {
              var cacheImage = document.createElement('img');
              cacheImage.src = arguments[i];
              cache.push(cacheImage);
            }
          }
        })(jQuery)
        $.preLoadImages('../addons/haoman_base/dpm/test01.png','../addons/haoman_base/dpm/test02.png','../addons/haoman_base/dpm/test03.png','../addons/haoman_base/dpm/test04.png','../addons/haoman_base/dpm/test05.png','../addons/haoman_base/dpm/test06.png','../addons/haoman_base/dpm/test07.png','../addons/haoman_base/dpm/test08.png');
</script>
</head>

<body {if !empty($video['vodio_bg5'])}data-vide-bg="{php echo tomedia($video['vodio_bg5'])}"{/if}>
    <div id="wrap" class="wrapbg">
    
        <div class="chrometips chromeTip" style="display:none;">
            <a href="javascript:void(0);" class="btntips-close" id="chromeTipCloseBtn">×</a>
            <div class="inner-chrometips">
                <p class="chrm-word1">由于你正在使用非Chrome浏览器，大屏幕的体验处于不佳状态，建议您立刻更换浏览器，以获得更好的大屏幕产品用户体验</p>
            </div>
        </div>
        <script>
        $(function() {



            var isChrome = navigator.userAgent.indexOf('Chrome') != -1;
            if (!isChrome) {
                $('.chromeTip').show();
            }
            $('#chromeTipCloseBtn').click(function() {
                $('.chromeTip').hide();
            });
            //10s后自动关闭
            setTimeout(function() {
                $('.chromeTip').hide();
            }, 30000);
        });
        </script>
        <div id="whole">
            <div id="header" class="clearfix">
                <div class="word-scroll left">
                    <div class="clearfix">
                        <div class="scrollbox left">
                            <ul class="word-list wordList">
                                <li class="themeBox" style="text-align:center;line-height: 86px; font-size: 46px; display: list-item;">{$reply['title']}</li>
                            </ul>
                        </div>
                    </div>
                </div>
                <span class="reserved right showIntroBtn">
                    {if $reply['up_qrcode']}
         <img class="qrcodeAll" src="{php echo tomedia($reply['up_qrcode'])}" style="max-width:126px;max-height:96px;">
                    {/if}
      </span>
            </div>
            <div class="fl-lottery lotteryLayer award-lottery" style="" data-type="advance">
                <div class="fl-inner fl-bg">
                    <div class="inner-cont clearfix">
                        <div class="prize-box right">
                            <span class="props props-color"></span>
                            <div class="outer-prize">
                                <div class="wrap-prize" style="height: 361px;">
                                    <div class="list-top clearfix">
                                        <p class="pro-num right">{if $reply['iscjnum']==0}获奖总人数{else}获奖人数{/if}<em class="winUserNum">{$winUserNum}</em></p>
                                        <span>获奖名单</span>
                                    </div>
                                    <div class="list-box">
                                        <p class="list-tit">
                                            <span>序号</span>
                                            <span>获奖者</span>
                                        </p>
                                        <div class="priname-box">
                                            <ul class="prize-list winUserList" id="winUserList">
                                                {loop $awardslist $index $row}
                                                <li class="clearfix" data-id="{$row['id']}" data-rank="1">
                                                    <p class="head-part left"> <span class="num-p winUserRankNum"><em>{php echo $index+1}</em></span>
                                                        <a href="javascript:;"><img style="margin-top: 5px;" width="50" height="50" src="{php echo tomedia($row['avatar'])}" alt=""></a>
                                                    </p> <a href="javascript:;" class="nick-name left winUserName">{$row['nickname']}</a> 
                                                     <a href="javascript:void(0);" class="delfans del delWinUser" data-id="{$row['id']}">×</a>
                                                </li>
                                                {/loop}
                                                
                                            </ul>
                                        </div>
                                    </div>

                                    <div class="und-btn">
                                        <a href="javascript:void(0);" class="reset"><span style="display: inline;">重新抽奖</span></a>
                                        <a href="javascript:void(0);" class="resetAll" style="display: inline-block;"><span style="display: inline;">全部重置</span></a>
                                    </div>

                                </div>
                            </div>
                        </div>
                       
                        <div class="prize-left">
                            <div class="box-ltop"><span style="left: 55px;" class="lott-wt lott-wt2">奖品专区</span><!-- <span style="float: right;margin-top: 10px;margin-right: 15px;font-size: 14px;height: 24px;line-height: 24px;">3D模式</span> --></div>
                            <div class="prize-show">
                                <ul class="prize-show-list clearfix" id="awardCategoryBox">
                                    {loop $list $index $row}
                                    <li data-category_id="{$row['id']}" {if $index == 0}class=""{else}class="hidden"{/if}>
                                        <p class="with-map3"><img src="{php echo tomedia($row['awardsimg'])}" alt=""></p>
                                        <p class="with-intro">{$row['prizename']}</p>
                                    </li>
                                    {/loop}
                                   
                                </ul>
                            </div>
                            <div style="width: 100%;text-align: center;line-height: 24px;height: 24px;padding-bottom: 15px;" ><span style="float: left;margin-left: 30px;"><a style="color: #fff" href="javascript:void(0);" id="nextAward">下一个奖品</a></span><span style="float: right;margin-right: 30px;"><a id="preAward" style="color: #fff;display: none" href="javascript:void(0);">上一个奖品</a></span></div>
                        </div>
                        <div class="lottery-box">
                            <div class="box-ltop">
                                <span class="lott-wt">现场抽奖</span>
                                <p class="lott-w"><span>参加抽奖人数</span><em class="join-num lotteryUserNum">{$totaldata}</em></p>
                            </div>
                            <div class="rock-box">
                                <span class="rock-head"><img  src="../addons/haoman_dpm/img2/lottery-default.jpg" class="lotteryImg" width="178" height="178" alt=""></span>
                                <span class="rock-name lotteryName" data-id="4382562">... ...</span>
                            </div>
                            <div class="btn-clear clearfix">
                                <div class="choose-num " id="lotteryNumBox">
                                    <span>一次抽取</span>
                                    <select name="" id="lotteryNumSel">
                                        <option value="1">1</option>
                                        <option value="2">2</option>
                                        <option value="3">3</option>
                                        <option value="4">4</option>
                                        <option value="5">5</option>
                                        <option value="6">6</option>
                                        <option value="7">7</option>
                                        <option value="8">8</option>
                                        <option value="9">9</option>
                                        <option value="10">10</option>
                                        <option value="30">30</option>
                                        <option value="50">50</option>
                                        <option value="100">100</option>
                                        <option value="200">200</option>
                                    </select>
                                    <span>人</span>
                                </div>
                                <p class="btn-rock" id="startGame"><a href="javascript:void(0);" class="btn-start startLotteryBtn" data-disabled="no"><span style="display: inline;">开始抽奖</span></a></p>
                                <p class="btn-rock" id="ingGame" style="display:none;"><a href="javascript:void(0);" class="btn-start ingLotteryBtn" data-disabled="no"><span style="display: inline;">抽奖中</span></a></p>
                                <p class="btn-rock" id="stopGame" style="display:none;"><a href="javascript:void(0);" class="btn-start stopLotteryBtn" data-disabled="no"><span style="display: inline;">停止</span></a></p>
                            </div>
                            <div class="btn-clear" id="slaveScreenLotteryTip" style="display:none;">
                                <p class="sup-tips">抽奖进行中...</p>
                            </div>
                        </div>
                    </div>
                </div>




  





            </div>
          
      
   <audio src="{$music}" preload="auto" id="media" autoplay="autoplay" loop="loop"></audio>
    </body>
</html>



    
    <script>
    $(function() {
        if($('#music_img',window.parent.document).attr("src") == '../addons/haoman_dpm/common/footer/no_music.png'){
            document.getElementById('media').pause();
        }

        setInterval(function(){
            $.ajax({
                url:"{php echo $this->createMobileUrl('haishen', array('rid' => $rid,'gets'=>'fans'))}",
                dataType:'json',
                success:function(data){

                    var code = data['code'];
                    var shenyu = data['shenyu'];
                    $('.lotteryUserNum').html(shenyu);
                    // console.log(shenyu);
                }
            })
        },4000);

    });


        var fansNewData = new Array();
        var nextFansNewData = new Array();
        var prevFansNewData = new Array();
        var award_user = new Array();
        var isGameIng = false;
      $(".startLotteryBtn").click(function(g) { 
        gameStart();
      });

        function gameStart(){
            if (fansNewData.length>0) {
                fansNewData.length = 0;
            }
            if(isGameIng){
                return;
            }
            isGameIng = true;
            $(".lotteryLayer .lotteryImg").attr("src", "../addons/haoman_dpm/img2/lottery-default.jpg");
            $(".lotteryLayer .lotteryName").html("... ...").attr("data-id", 1);

            var lUserNum = parseInt($('.lotteryUserNum').text());
            var winUserNum = parseInt($('.winUserNum').text());
            var lotteryNumSel = parseInt($("#lotteryNumSel").val());
            if(winUserNum >= lUserNum){
                alert("已经没有可抽奖的人了!！");
                isGameIng = false;
                return
            }

            if(lotteryNumSel > (lUserNum - winUserNum)){
                alert("您选择的人数超过可以抽奖的人数！");
                isGameIng = false;
                return
            }

          $("#startGame").hide();
          $("#ingGame").show();
          var _award_id = $("#awardCategoryBox li:visible").data("category_id");
          // alert(_award_id);
          $(".lotteryLayer .lotteryName").html("抽奖进行中...").attr("data-id", 1);
          w = setInterval(function() { e() }, 50);
          var winUserNum = $(".winUserNum").text();
          

            $.ajax({
                    url: "{php echo $this->createMobileUrl('dpm_getchoujiang', array('rid' => $rid))}",
                    dataType: "json",
                    async:true,
                    data: {
                        winUserNum:winUserNum,
                        lotteryNumSel:lotteryNumSel,
                        awardid:_award_id,
                        iscjnum:1
                    },
                    beforeSend: function () {
                       
                    },
                    success: function (data) {
                        // console.log(lotteryNumSel)
                        if(data.ret == 1){

                            setTimeout(function() {
                                $("#ingGame").hide();
                                $("#stopGame").show();
                            }, 2000);
                            // console.log(data.data)
                            fansData = data.data;
                            award_user = data.data;
                            fansNum = data.num;
                            $.each(fansData, function(i, v) {
                                fansNewData.push(new Array(v['id'], v['avatar'], v['nickname']));
                            });
                        }else {
                            alert("网络参数错误,请刷新页面重试！");
                            clearInterval(w);
                            $("#ingGame").hide();
                            $("#startGame").show();
                            isGameIng = false;

                        }
                    },
                    error: function () {
                        alert("已经没有人可以抽了?！");

                        $(".lotteryLayer .lotteryName").html("... ...").attr("data-id", 1);
                        clearInterval(w);
                        $("#ingGame").hide();
                        $("#startGame").show();
                        isGameIng = false;

                    },
                    timeout: 15000
                })


     }

      

      $(".stopLotteryBtn").click(function(g) { 
        gameResult();
          {if $reply['is_award']!=1}
          notice_awarduser();
          {/if}
      });

        function gameResult(){
          
          var html = '';
          var t = $(".winUserList li").length;

          for (var i = 0; i < fansData.length; i++) {

            var sort = i + t + 1;
            html += '<li class="clearfix" data-id="'+fansNewData[i][0]+'" data-rank="1"><p class="head-part left"> <span class="num-p winUserRankNum"><em>'+sort+'</em></span><a href="javascript:;"><img style="margin-left: 5px;margin-top: 5px;" width="50" height="50" src="'+fansNewData[i][1]+'" alt=""></a></p> <a href="javascript:;" class="nick-name left winUserName">'+fansNewData[i][2]+'</a> <a href="javascript:void(0);" class="delfans del delWinUser" data-id="'+fansNewData[i][0]+'">×</a> </li>';
          }

          $(".winUserNum").html(fansNum);
          // var t = $(".winUserList li").length;
          // var t2 = t-1;
          // var t1 = $(".winUserList li:eq("+t2+")").append(html);
          $("#winUserList").append(html);
          // alert(t1);
          if(fansNewData[0][1] == '' || fansNewData[0][1] == null){
            fansNewData[0][1] = '../addons/haoman_dpm/img3/3d_default.jpg';
          }

          $(".lotteryLayer .lotteryImg").attr("src", fansNewData[0][1]);
          $(".lotteryLayer .lotteryName").html(fansNewData[0][2]).attr("data-id", 1);
          $("#startGame").show();
          $("#stopGame").hide();
          clearInterval(w);
            isGameIng = false;
          fansNum = null;
          w = null;
      }

        function notice_awarduser(){
            var _award_id = $("#awardCategoryBox li:visible").data("category_id");

        $.ajax({

            url: "{php echo $this->createMobileUrl('dpm_notice_awarduser', array('rid' => $rid))}",
            dataType: "json",
            data: {
                awarduser:award_user,
                award_id:_award_id
            },
            beforeSend: function () {

            },
            success: function (data) {
                if(data.ret == 1){
                 // alert(data.msg);
                    awarduser = null;
                }else{
                 //   alert("2");
//                    window.setTimeout('notice_awarduser();', 3000);
                }


            },
            error: function () {
              //  alert("2");
//                alert("网络太慢了，获取不到奖品信息！");
            },
            timeout: 15000
        })
            awarduser = null;
    }

      $("#nextAward").on("click",function(){
            if (nextFansNewData.length>0) {
                nextFansNewData.length = 0;
            }
          var J = $("#awardCategoryBox li:visible");
          var G;
          G = J.next();
          var gNext = G.next();
          _award_category_id = G.data("category_id");
          

          $.ajax({
            url: "{php echo $this->createMobileUrl('dpm_getCjAwardsList', array('rid' => $rid))}",
            dataType: "json",
            data: {
                awardid:_award_category_id,
            },
            beforeSend: function () {
               
            },
            success: function (data) {
                if(data.ret == 1){
                    var nextFansData = data.data;
                    var nextFansNum = data.num;
                    
                    $.each(nextFansData, function(i, v) {
                        nextFansNewData.push(new Array(v['id'], v['avatar'], v['nickname']));
                    });
                    var html = '';
                    for (var i = 0; i < nextFansData.length; i++) {
                        var sort = i+1;
                        html += '<li class="clearfix" data-id="'+nextFansNewData[i][0]+'" data-rank="1"><p class="head-part left"> <span class="num-p winUserRankNum"><em>'+sort+'</em></span><a href="javascript:;"><img style="margin-left: 5px;margin-top: 5px;" width="50" height="50" src="'+nextFansNewData[i][1]+'" alt=""></a></p> <a href="javascript:;" class="nick-name left winUserName">'+nextFansNewData[i][2]+'</a> <a href="javascript:void(0);" class="delfans del delWinUser" data-id="'+nextFansNewData[i][0]+'">×</a> </li>';
                    }
                    $(".winUserNum").html(nextFansNum);
                    $("#winUserList").html(html);

                }
                
                
            },
            error: function () {
                alert("网络太慢了，获取不到奖品信息！");
            },
            timeout: 15000
        })

          G.removeClass("hidden").siblings().addClass("hidden");

          if(gNext.data("category_id") == null){
            // alert("没奖品了");
            $("#nextAward").hide();
          }

          $("#preAward").show();

      });

      $("#preAward").on("click",function(){
        if (prevFansNewData.length>0) {
                prevFansNewData.length = 0;
            }
          var J = $("#awardCategoryBox li:visible");
          var G;
          G = J.prev();
          var gPrev = G.prev();
          _award_category_id = G.data("category_id");

          $.ajax({
            url: "{php echo $this->createMobileUrl('dpm_getCjAwardsList', array('rid' => $rid))}",
            dataType: "json",
            data: {
                awardid:_award_category_id,
            },
            beforeSend: function () {
               
            },
            success: function (data) {
                if(data.ret == 1){
                    var prevFansData = data.data;
                    
                    var prevFansNum = data.num;
                    $.each(prevFansData, function(i, v) {
                        prevFansNewData.push(new Array(v['id'], v['avatar'], v['nickname']));
                    });
                    var html = '';
                    for (var i = 0; i < prevFansData.length; i++) {
                        var sort = i + 1;
                        html += '<li class="clearfix" data-id="'+prevFansNewData[i][0]+'" data-rank="1"><p class="head-part left"> <span class="num-p winUserRankNum"><em>'+sort+'</em></span><a href="javascript:;"><img style="margin-left: 5px;margin-top: 5px;" width="50" height="50" src="'+prevFansNewData[i][1]+'" alt=""></a></p> <a href="javascript:;" class="nick-name left winUserName">'+prevFansNewData[i][2]+'</a> <a href="javascript:void(0);" class="delfans del delWinUser" data-id="'+prevFansNewData[i][0]+'">×</a> </li>';
                    }
                    $(".winUserNum").html(prevFansNum);
                    $("#winUserList").html(html);
                    
                }
                
                
            },
            error: function () {
                alert("网络太慢了，获取不到奖品信息！");
            },
            timeout: 15000
        })

          
          G.removeClass("hidden").siblings().addClass("hidden");

          if(gPrev.data("category_id") == null){
            $("#preAward").hide();
          }
          $("#nextAward").show();

      });

      var t = 1;
      function e() {
        $(".lotteryLayer .lotteryImg").attr("src", "../addons/haoman_base/dpm/test0"+t+".png");
        t++;
        if(t>5){
          t = 1;
        }
      }



    $(".reset").on("click",function(){
        var resetOk = confirm("您确定要重新抽奖，该奖品之前中奖记录将清空！");
        var reset_award_id = $("#awardCategoryBox li:visible").data("category_id");
        if (resetOk == true){

            $.ajax({
            url: "{php echo $this->createMobileUrl('resetAwards', array('rid' => $rid,'code'=>'reset'))}",
            dataType: "json",
            data: {
                rawardid:reset_award_id,
            },
            beforeSend: function () {
               
            },
            success: function (data) {
                    if(data.ret == 1){
                        $("#winUserList").html('');
                        $(".winUserNum").html('0');
                        alert("奖品重置成功，可以重新抽奖了。")
                    }else{
                        alert("奖品重置失败，请刷新页面重试。")
                    }
                },
                error: function () {
                    alert("网络太慢了，重置失败！");
                },
                timeout: 15000
            })

          };
    })

    $(".resetAll").on("click",function(){
        var resetAllOk = confirm("您确定要重置所有奖项，之前所有中奖记录将清空！")
        if (resetAllOk == true){
            
            $.ajax({
            url: "{php echo $this->createMobileUrl('resetAwards', array('rid' => $rid,'code'=>'resetAll'))}",
            dataType: "json",
            data: {

            },
            beforeSend: function () {
               
            },
            success: function (data) {
                    if(data.ret == 1){
                        $("#winUserList").html('');
                        $(".winUserNum").html('0');
                        alert("奖品重置成功，可以重新抽奖了。")
                    }else{
                        alert("奖品重置失败，请刷新页面重试。")
                    }
                },
                error: function () {
                    alert("网络太慢了，重置失败！");
                },
                timeout: 15000
            })


        }
    })


    function spaceStart(){
        if(!$('#stopGame').is(":hidden")){
            // if(isGameIng){
            //     return;
            // }
           // console.log(1)
            gameResult();
            {if $reply['is_award']!=1}
            notice_awarduser();
            {/if}
        }else{
            if(isGameIng){
                return;
            }
           // console.log(11)
            gameStart();
        }
    }

    $(document).keydown(function(e){
        if(e.which == 32) {
            spaceStart();
        }

   });





    
    </script>

</body>
{template 'dpm_Keyborad'}
</html>
